<!doctype html>
<html class="no-js fixed-layout">
<head>
<% include("/common/shop_head.html"){}%>
<script type="text/javascript">
  $(function(){
    $('.category-sort').bind({mouseover:function(){
        $(this).children('.category-detail').removeClass("am-hide").show();
      },mouseout:function(){
        $(this).children('.category-detail').hide();
      }
    });
  });
</script>
</head>
<body>
<%include("/shop/header.html"){}%>
<div class="am-cf shop-main">
  <!-- content start -->
  <div class="shop-content">
    <div class="shop-content-body">
      <div class="am-g">
        <div class="am-u-sm-12 am-u-md-12 am-u-lg-8 am-padding-horizontal-xs">
          <div class="am-slider am-slider-default" data-am-flexslider id="demo-slider-0">
            <ul class="am-slides">
              <%for(list in systemConfig.bannerImagePathList){%>
              <li><img src="${base}${list}" /></li>
              <%}%>
              <%if (systemConfig.bannerImagePathList! == null || systemConfig.bannerImagePathList.~size == 0){%>
              <li><img src="${base}/statics/img/upload/default_banner.png" /></li>
              <%}%>
            </ul>
          </div>
        </div>
        <div class="am-u-lg-4">
          <ol class="am-breadcrumb am-breadcrumb-slash am-margin-bottom-xs">
            <li class="am-active"><span class="am-icon-cart-plus">新品上架</span></li>
          </ol>
          <ul class="am-avg-sm-3 am-avg-md-9 am-avg-lg-4 am-thumbnails">
            <%for(list in newProductList){%>
            <li><a href="${base}${list.htmlFilePath}"><img class="am-thumbnail" src="${base}${list.productImageList[0].thumbnailProductImagePath!systemConfig.defaultThumbnailProductImagePath}" alt="${list.name}" /></a></li>
            <%if(listLP.index == 8){%>
            <%break;%>
            <%}%>
            <%}%>
          </ul>
        </div>
      </div>
          
      <div class="am-panel am-panel-secondary">
        <div class="am-panel-hd">
          <ol class="am-breadcrumb am-breadcrumb-slash am-padding-0 am-margin-0">
            <li class="am-active"><span class="am-icon-trophy"> </span>热卖商品</li>
          </ol>
        </div>
        <div class="am-panel-bd">
          <ul class="am-avg-sm-2 am-avg-md-3 am-avg-lg-5 am-thumbnails">
            <%for(list in hotProductList){%>
            <li>
              <a href="${base}${list.htmlFilePath}">
                <img class="am-thumbnail am-radius am-margin-bottom-0" src="${base}${list.productImageList[0].smallProductImagePath!systemConfig.defaultSmallProductImagePath}" />
                <p class="am-kai am-text-sm am-text-center am-text-truncate am-margin-0">${list.name}</p>
                <p class="am-monospace am-text-danger am-text-center am-margin-0">${list.price,priceCurrencyFormat}</p>
              </a>
            </li>
            <%}%>
          </ul>
        </div>
      </div>
          
      <div class="am-panel am-panel-success">
        <div class="am-panel-hd">
          <ol class="am-breadcrumb am-breadcrumb-slash am-padding-0 am-margin-0">
            <li class="am-active"><span class="am-icon-thumbs-up"> </span>精品推荐</li>
          </ol>
        </div>
        <div class="am-panel-bd">
          <ul class="am-avg-sm-2 am-avg-md-3 am-avg-lg-5 am-thumbnails">
            <%for(list in bestProductList){%>
            <li>
              <a href="${base}${list.htmlFilePath}">
                <img class="am-thumbnail am-margin-bottom-0" src="${base}${list.productImageList[0].smallProductImagePath!systemConfig.defaultSmallProductImagePath}" />
                <p class="am-kai am-text-sm am-text-center am-text-truncate am-margin-0">${list.name}</p>
                <p class="am-monospace am-text-danger am-text-center am-margin-0">${list.price,priceCurrencyFormat}</p>
              </a>
            </li>
            <%}%>
          </ul>
        </div>
      </div>
      <%include("/shop/friend_link.html"){}%>
    </div>
    <%include("/shop/footer.html"){}%>
  </div>
  <!-- content end -->
</div>
</body>
</html>